<script setup lang="ts">
import { RouterLink, RouterView } from 'vue-router'
import content from '@/views/desktop/Content.vue'
import myNav from '@/views/desktop/Nav.vue'
import { provide, ref } from 'vue'
import { MenuType, Note, UserConfig } from '@/views/desktop/type'
import { getMenuList } from '@/api/desktop/MenuApi'
import { getUserConfig } from '@/api/desktop/UserApi'
import { list } from '@/api/desktop/NoteApi'
import { inject } from 'vue/dist/vue'

let menus = ref<MenuType[]>([])
let dialogVisible = ref({})
let menu = ref<MenuType[]>([])
let userConfig = ref<UserConfig>(new UserConfig())
let notes = ref<Note[]>()

const initDesk = () => {
  getMenuList({}).then((res: any) => {
    for (let item of res) {
      // 把item的id作为dialogVisible的key
      dialogVisible.value[item.id] = false
      if (item.positionX != 0 && item.positionY != 0) {
        item.position = `position: absolute;z-index: 1000;left: ${item.positionX};top: ${item.positionY}`
      }
    }
    menus.value = res
  })
  getUserConfig().then((res) => {
    userConfig.value = res
  })

  list(null).then((res) => {
    if (res) {
      for (let item of res) {
        if (item.positionX != 0 && item.positionY != 0) {
          item.position = `position: absolute;z-index: 1000;left: ${item.positionX};top: ${item.positionY}`
        }
      }
    }
    notes.value = res
  })
}
initDesk()

provide('bottomMenus', menu)
provide('dialogVisible', dialogVisible)
provide('initDesk', initDesk)
provide('menus', menus)
provide('notes', notes)
provide('userConfig', userConfig)
</script>

<template>
  <div class="w-screen h-screen absolute overflow-hidden">
    <content class="relative top-0" />
    <my-nav class="relative bottom-0" />
  </div>
</template>

<style scoped></style>
